import { Col, Descriptions, Row } from 'antd';
import React from 'react';
import _ from 'lodash';

// 基本信息
export default function BasicInfo(props) {
  const { projectName, projectCode, projectArea, equityRatio } = props.data;
  return (
    <div className="approve-box-content-paragraph">
      <div className="approve-box-content-paragraph-title">基本信息</div>
      <Row type="flex" justify="space-between" gutter={[50, 0]}>
        <Col span={10}>
          <Descriptions size="small" title="" bordered>
            <Descriptions.Item label="项目">{`${projectName}(${projectCode})`}</Descriptions.Item>
          </Descriptions>
        </Col>
        <Col span={8}>
          <Descriptions size="small" title="" bordered>
            <Descriptions.Item label="区域">{projectArea}</Descriptions.Item>
          </Descriptions>
        </Col>
        <Col span={6}>
          <Descriptions size="small" title="" bordered>
            <Descriptions.Item label="权益比例">
              {Number(_.isNaN(equityRatio) ? 0 : equityRatio).toFixed(2)}%
            </Descriptions.Item>
          </Descriptions>
        </Col>
      </Row>
    </div>
  );
}
